<template>
  <div class="box">
    <el-form size="medium" ref="itemForm" :model="obj" :rules="itemRules" label-width="100px">
      <el-form-item label="任务名称" prop="name"><el-input placeholder="请输入打印机名称" v-model="obj.name"></el-input></el-form-item>

      <el-form-item label="打印场景">
        <el-checkbox :true-label="1" :false-label="0" v-model="obj.configure.place">下单打印</el-checkbox>
        <el-checkbox :true-label="1" :false-label="0" v-model="obj.configure.pay">付款打印</el-checkbox>
        <el-checkbox :true-label="1" :false-label="0" v-model="obj.configure.receiving">确认收货打印</el-checkbox>
      </el-form-item>

      <el-form-item label="打印模板" prop="template_id">
        <el-select v-model="obj.template_id" placeholder="请选择打印模板">
          <el-option v-for="item in templateList" :key="item.id" :label="item.name" :value="item.id"></el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="打印联数">
        <el-radio-group v-model="obj.number">
          <el-radio :label="1">1联</el-radio>
          <el-radio :label="2">2联</el-radio>
          <el-radio :label="3">3联</el-radio>
          <el-radio :label="4">4联</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="打印类型">
        <el-radio-group v-model="obj.type">
          <el-radio :label="0">全部</el-radio>
          <el-radio :label="1">快递</el-radio>
          <el-radio :label="2" v-has='11'>自提</el-radio>
          <el-radio :label="3" v-has='16'>同城</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="打印机" prop="printer_id">
        <el-select v-model="obj.printer_id" placeholder="请选择打印机">
          <el-option v-for="item in printerList" :key="item.id" :label="item.name" :value="item.id"></el-option>
        </el-select>
      </el-form-item>

      <el-form-item label="所属门店" v-if="obj.type==2||obj.type==3">
        <el-select v-model="obj.store_id" clearable placeholder="请选择所属门店">
          <el-option v-for="item in storeList" :key="item.id" :label="item.name" :value="item.id"></el-option>
        </el-select>
      </el-form-item>

      <el-form-item><el-button type="primary" @click="saveData">保存数据</el-button></el-form-item>
    </el-form>
  </div>
</template>
<script>
import {addReceiptTask, editReceiptTask, getReceiptTask, getReceiptPrinterList, getReceiptTemplateList} from '@/api/shop/print';
import {getallStore} from '@/api/shop/store';

export default {
  name: 'receiptTaskItem',
  data() {
    return {
      isLoading: false,
      isEdit: false,
      obj: {
        name: '',
        configure: {
          place: 1,
          pay: 1,
          receiving: 1
        },
        template_id: '',
        printer_id: '',
        number: 1,
        store_id: ''
      },
      printerList: [],
      templateList: [],
      storeList: [],
      itemRules: {
        name: [
          {
            required: true,
            message: '请输入计划名称'
          }
        ],
        template_id: [
          {
            required: true,
            message: '请选择打印模板'
          }
        ],
        printer_id: [
          {
            required: true,
            message: '请选择打印机'
          }
        ]
      }
    };
  },
  created() {
    this.getPrinters();
    this.getTemplates();
    this.getStores();
  },
  methods: {
    //初始化
    init(id) {
      this.isEdit = true;
      this.isLoading = true;
      getReceiptTask(id)
        .then(res => {
          this.isLoading = false;
          //设置内容
          let o = res.msg;
          if (o.store_id == 0) {
            o.store_id = '';
          }
          this.obj = {...o};
          this.obj.configure = JSON.parse(this.obj.configure);
        })
        .catch(e => {
          this.isLoading = false;
        });
    },
    //获取基础打印机列表
    getPrinters() {
      getReceiptPrinterList()
        .then(res => {
          this.printerList = res.msg;
        })
        .catch(e => {
          console.log('发生错误');
        });
    },
    //获取基础小票模板列表
    getTemplates() {
      getReceiptTemplateList()
        .then(res => {
          this.templateList = res.msg;
        })
        .catch(e => {
          console.log('发生错误');
        });
    },
    //获取门店列表
    getStores() {
      getallStore()
        .then(res => {
          this.storeList = res.msg;
        })
        .catch(e => {
          console.log('发生错误');
        });
    },
    //保存数据(修改发货地址)
    saveData() {
      this.$refs.itemForm.validate(valid => {
        if (valid) {
          let o = {...this.obj};

          this.isLoading = true;
          if (this.isEdit) {
            //编辑
            editReceiptTask(o)
              .then(res => {
                this.isLoading = false;
                this.$emit('success');
              })
              .catch(e => {
                this.isLoading = false;
              });
          } else {
            //新增
            addReceiptTask(o)
              .then(res => {
                this.isLoading = false;
                this.$emit('success');
              })
              .catch(e => {
                this.isLoading = false;
              });
          }
        } else {
          //console.log('error')
          return false;
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.el-form-item {
  margin-bottom: 15px;
}
</style>
